<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>一个静态页面</title>
    <link rel="shortcut icon" href="../../../../favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="./index.css">
</head>

<body>
    <div id="header">
        <div class="w">
            <div id="logo">
                <h1>Logo</h1>
            </div>
            <div id="nav">
                <a href="#">Github</a>
                <a href="#">Foreign</a>
                <a href="#">Login</a>
            </div>
        </div>
    </div>
    <div id="banner">
        <div class="center w">
            <div class="nav">
                <input name="nav" type="radio" hidden id="a">
                <label class="nav-label" for="a">1</label>
                <input checked name="nav" type="radio" hidden id="b">
                <label class="nav-label" for="b">2</label>
                <input name="nav" type="radio" hidden id="c">
                <label class="nav-label" for="c">3</label>
                <input name="nav" type="radio" hidden id="d">
                <label class="nav-label" for="d">4</label>
            </div>
        </div>
    </div>
    <div id="main">
        <div id="main-hd">
            <div class="w nav-bar">
                <input checked name="nav-bar" checked type="radio" hidden id="wa">
                <label for="wa">Home</label>
                <input name="nav-bar" type="radio" hidden id="wb">
                <label for="wb">Profile</label>
                <input name="nav-bar" type="radio" hidden id="wc">
                <label for="wc">About</label>
            </div>
            <hr>
        </div>
        <div id="main-bd">
            <div class="w">
                <div class="row1">
                    <div>column1</div>
                    <div>column2</div>
                    <div>column3</div>
                </div>
                <div class="row2">
                    <div>column4</div>
                    <div>column5</div>
                    <div>column6</div>
                    <div>column7</div>
                </div>
                <div class="row3">
                    <div>column8</div>
                    <div>column9</div>
                    <div>column10</div>
                </div>
            </div>
        </div>
    </div>
    <div id="footer">&copy;2019 <a href="http://ife.baidu.com/">ife.baidu.com</a></div>
</body>

</html>